// 已弃用
import { ref } from 'vue'

let x = ref(null)
let y = ref(null)

function iconMove(iconBox){  
    iconBox.addEventListener('mousedown', useMouse);
    // document.addEventListener('contextmenu',prevent)
}

//拖拽功能
function useMouse(e){
    x=e.pageX-iconBox.offsetLeft;
    y=e.pageY-iconBox.offsetTop;
       
    document.addEventListener('mousemove',move)

    document.addEventListener('mouseup',function(e){
        document.removeEventListener('mousemove',move)
        document.onmousemove=null
    })
}

function move(e){
    if(e.pageX - x.value<=0){
        iconBox.style.left=0+'px'
    }else{
        console.log(iconBox.clientWidth,document.body.offsetWidth);
        if((e.pageX - x.value)+iconBox.offsetWidth>=document.body.offsetWidth){
            iconBox.style.left=document.body.offsetWidth - iconBox.offsetWidth - 20 +'px';
        }else{
            iconBox.style.left=e.pageX - x.value + 'px';
        }
    }
    if(e.pageY - y.value<=0){
        iconBox.style.top=0+'px'; 
    }else{
        let workHeight = document.body.offsetHeight - document.querySelector('.bottom-nav').offsetHeight
        console.log(iconBox.clientHeight,document.body.offsetHeight);
        if((e.pageY - y.value)+iconBox.offsetHeight>=workHeight){
            iconBox.style.top=workHeight - iconBox.offsetHeight - 20 + 'px';
        }else{
            iconBox.style.top=e.pageY - y.value + 'px';
        }
        
    }
}
// //全局禁止右键
// function prevent(e){
//     e.preventDefault();
// }

export default iconMove